<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- 
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements.  See the NOTICE file
distributed with this work for additional information
regarding copyright ownership.  The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License.  You may obtain a copy of the License at

 http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied.  See the License for the
specific language governing permissions and limitations
under the License. 
-->
<html>
<head>
    <link type="text/css" rel="stylesheet" href="https://struts.apache.org/css/default.css">
    <style type="text/css">
        .dp-highlighter {
            width:95% !important;
        }
    </style>
    <style type="text/css">
        .footer {
            background-image:      url('https://cwiki.apache.org/confluence/images/border/border_bottom.gif');
            background-repeat:     repeat-x;
            background-position:   left top;
            padding-top:           4px;
            color:                 #666;
        }
    </style>
    <link href='https://struts.apache.org/highlighter/style/shCoreStruts.css' rel='stylesheet' type='text/css' />
    <link href='https://struts.apache.org/highlighter/style/shThemeStruts.css' rel='stylesheet' type='text/css' />
    <script src='https://struts.apache.org/highlighter/js/shCore.js' type='text/javascript'></script>
    <script src='https://struts.apache.org/highlighter/js/shBrushPlain.js' type='text/javascript'></script>
    <script src='https://struts.apache.org/highlighter/js/shBrushXml.js' type='text/javascript'></script>
    <script src='https://struts.apache.org/highlighter/js/shBrushJava.js' type='text/javascript'></script>
    <script src='https://struts.apache.org/highlighter/js/shBrushJScript.js' type='text/javascript'></script>
    <script src='https://struts.apache.org/highlighter/js/shBrushGroovy.js' type='text/javascript'></script>
    <script src='https://struts.apache.org/highlighter/js/shBrushBash.js' type='text/javascript'></script>
    <script type="text/javascript">
        SyntaxHighlighter.defaults['toolbar'] = false;
        SyntaxHighlighter.all();
    </script>
    <script type="text/javascript" language="javascript">
        var hide = null;
        var show = null;
        var children = null;

        function init() {
            /* Search form initialization */
            var form = document.forms['search'];
            if (form != null) {
                form.elements['domains'].value = location.hostname;
                form.elements['sitesearch'].value = location.hostname;
            }

            /* Children initialization */
            hide = document.getElementById('hide');
            show = document.getElementById('show');
            children = document.all != null ?
                    document.all['children'] :
                    document.getElementById('children');
            if (children != null) {
                children.style.display = 'none';
                show.style.display = 'inline';
                hide.style.display = 'none';
            }
        }

        function showChildren() {
            children.style.display = 'block';
            show.style.display = 'none';
            hide.style.display = 'inline';
        }

        function hideChildren() {
            children.style.display = 'none';
            show.style.display = 'inline';
            hide.style.display = 'none';
        }
    </script>
    <title>Using Struts 2 Tags</title>
</head>
<body onload="init()">
<table border="0" cellpadding="2" cellspacing="0" width="100%">
    <tr class="topBar">
        <td align="left" valign="middle" class="topBarDiv" align="left" nowrap>
            &nbsp;<a href="home.html">Home</a>&nbsp;&gt;&nbsp;<a href="tutorials.html">Tutorials</a>&nbsp;&gt;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&gt;&nbsp;<a href="how-to-create-a-struts-2-web-application.html">How To Create A Struts 2 Web Application</a>&nbsp;&gt;&nbsp;<a href="create-struts-2-web-application-with-artifacts-in-web-inf-lib-and-use-ant-to-build-the-application.html">Create Struts 2 Web Application With Artifacts In WEB-INF lib and Use Ant To Build The Application</a>&nbsp;&gt;&nbsp;<a href="hello-world-using-struts-2.html">Hello World Using Struts 2</a>&nbsp;&gt;&nbsp;<a href="using-struts-2-tags.html">Using Struts 2 Tags</a>
        </td>
        <td align="right" valign="middle" nowrap>
            <form name="search" action="https://www.google.com/search" method="get">
                <input type="hidden" name="ie" value="UTF-8" />
                <input type="hidden" name="oe" value="UTF-8" />
                <input type="hidden" name="domains" value="" />
                <input type="hidden" name="sitesearch" value="" />
                <input type="text" name="q" maxlength="255" value="" />
                <input type="submit" name="btnG" value="Google Search" />
            </form>
        </td>
    </tr>
</table>

<div id="PageContent">
    <div class="pageheader" style="padding: 6px 0px 0px 0px;">
        <!-- We'll enable this once we figure out how to access (and save) the logo resource -->
        <!--img src="/wiki/images/confluence_logo.gif" style="float: left; margin: 4px 4px 4px 10px;" border="0"-->
        <div style="margin: 0px 10px 0px 10px" class="smalltext">Apache Struts 2 Documentation</div>
        <div style="margin: 0px 10px 8px 10px"  class="pagetitle">Using Struts 2 Tags</div>

        <div class="greynavbar" align="right" style="padding: 2px 10px; margin: 0px;">
            <a href="https://cwiki.apache.org/confluence/pages/editpage.action?pageId=14811875">
                <img src="https://cwiki.apache.org/confluence/images/icons/notep_16.gif"
                     height="16" width="16" border="0" align="absmiddle" title="Edit Page"></a>
            <a href="https://cwiki.apache.org/confluence/pages/editpage.action?pageId=14811875">Edit Page</a>
            &nbsp;
            <a href="https://cwiki.apache.org/confluence/pages/listpages.action?key=WW">
                <img src="https://cwiki.apache.org/confluence/images/icons/browse_space.gif"
                     height="16" width="16" border="0" align="absmiddle" title="Browse Space"></a>
            <a href="https://cwiki.apache.org/confluence/pages/listpages.action?key=WW">Browse Space</a>
            &nbsp;
            <a href="https://cwiki.apache.org/confluence/pages/createpage.action?spaceKey=WW&fromPageId=14811875">
                <img src="https://cwiki.apache.org/confluence/images/icons/add_page_16.gif"
                     height="16" width="16" border="0" align="absmiddle" title="Add Page"></a>
            <a href="https://cwiki.apache.org/confluence/pages/createpage.action?spaceKey=WW&fromPageId=14811875">Add Page</a>
            &nbsp;
            <a href="https://cwiki.apache.org/confluence/pages/createblogpost.action?spaceKey=WW&fromPageId=14811875">
                <img src="https://cwiki.apache.org/confluence/images/icons/add_blogentry_16.gif"
                     height="16" width="16" border="0" align="absmiddle" title="Add News"></a>
            <a href="https://cwiki.apache.org/confluence/pages/createblogpost.action?spaceKey=WW&fromPageId=14811875">Add News</a>
        </div>
    </div>

    <div class="pagecontent">
        <div class="wiki-content">
            <div id="ConfluenceContent"><div class="confluence-information-macro confluence-information-macro-information"><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>This tutorial assumes you've completed the <a shape="rect" href="hello-world-using-struts-2.html">Hello World</a> tutorial and have a working helloworld project. The example code for this tutorial, using_tags, is available for checkout from the Struts 2 GitHub repository at <a shape="rect" class="external-link" href="https://github.com/apache/struts-examples" rel="nofollow">https://github.com/apache/struts-examples</a>. The example projects use Maven to manage the artifact dependencies and to build the .war files.</p></div></div><p>In the <a shape="rect" href="hello-world-using-struts-2.html">Hello World</a> lesson, we added to the index.jsp a Struts 2 url tag to create a hyperlink to the hello.action. This tutorial will explore the url and other Struts 2 tags further.</p><p>Web applications differ from conventional websites in that web applications can create a dynamic response. To make it easier to reference dynamic data from a page, the Struts 2 framework offers a set of tags. Some of the tags mimic standard HTML tag while providing added value. Other tags create non-standard, but useful controls.</p><div class="confluence-information-macro confluence-information-macro-information"><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>To use the Struts 2 tags on the view page, you must include a tag library directive. Typically, the taglib directive is <code>&lt;%@ taglib prefix="s" uri="/struts-tags" %&gt;</code>. So the prefix for all the Struts 2 tags will be "s". <br clear="none"> If you want to actually read the Struts 2 tag TLD file, you'll find it in the META-INF folder of the Struts 2 core jar.</p></div></div><h3 id="UsingStruts2Tags-Struts2urlTag">Struts 2 url Tag</h3><p>One use of the Struts 2 Tags is to create links to other web resources, especially to other resources in the local application.</p><div class="confluence-information-macro confluence-information-macro-tip"><span class="aui-icon aui-icon-small aui-iconfont-approve confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>While HTML provides a simple <code>a</code> tag for creating hyperlinks, the HTML tag often requires us to include redundant information. Also the HTML tag cannot easily access dynamic data provided by the framework.</p></div></div><p>A very common use case in web applications is linking to other pages. In the <a shape="rect" href="hello-world.html">Hello World</a> tutorial we added to index.jsp a link to the hello.action using the Struts 2 url tag. Please refer to the <a shape="rect" href="url.html">url documentation</a> for more information about the url tag.</p><div class="code panel pdl" style="border-style: solid;border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;border-bottom-style: solid;"><b>index.jsp</b></div><div class="codeContent panelContent pdl">
<pre class="brush: html; gutter: false; theme: Default" style="font-size:12px;">&lt;%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%&gt;
&lt;%@ taglib prefix="s" uri="/struts-tags" %&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
&lt;title&gt;Basic Struts 2 Application - Welcome&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;h1&gt;Welcome To Struts 2!&lt;/h1&gt;
&lt;p&gt;&lt;a href="&lt;s:url action='hello'/&gt;"&gt;Hello World&lt;/a&gt;&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>
</div></div><p>When you run the Hello World tutorial in your Servlet container and then mouse over the Hello World hyperlink created by the Struts 2 url tag you'll see that the URL created is hello.action (relative to the web context's root folder).</p><p>Examine the struts.xml configuration in the Hello World tutorial and you will find this:</p><div class="code panel pdl" style="border-style: solid;border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;border-bottom-style: solid;"><b>struts.xml</b></div><div class="codeContent panelContent pdl">
<pre class="brush: xml; gutter: false; theme: Default" style="font-size:12px;">...
&lt;action name="hello" class="org.apache.struts.helloworld.action.HelloWorldAction" method="execute"&gt;
  &lt;result name="success"&gt;/HelloWorld.jsp&lt;/result&gt;
&lt;/action&gt;
...
</pre>
</div></div><p>The action node above maps the hello.action to the execute method of class HelloWorldAction. If the execute method returns success, the view page HelloWorld.jsp (in web context root folder) will be returned to the user.</p><p>A common use case is that the URL also needs to include a value for a query string parameter such as userName. To add a query string parameter and its value use the Struts 2 param tag, nested inside the url tag.</p><p>For the Using Tags tutorial add the following to index.jsp just after the link for Hello World.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>url tag with param</b></div><div class="codeContent panelContent pdl">
<pre class="brush: html; gutter: false; theme: Default" style="font-size:12px;">&lt;s:url action="hello" var="helloLink"&gt;
  &lt;s:param name="userName"&gt;Bruce Phillips&lt;/s:param&gt;
&lt;/s:url&gt;

&lt;p&gt;&lt;a href="${helloLink}"&gt;Hello Bruce Phillips&lt;/a&gt;&lt;/p&gt;

</pre>
</div></div><p>Rather then put the url tag as the value for the anchor tag's href attribute, we've separated out the s:url tag into its own code block. Nested inside the url tag is the Struts 2 param tag. This tag lets you specify a parameter name (e.g. userName) and a value for that paramter (e.g. Bruce Phillips).</p><p>Notice the use of the var attribute. The value of the var attribute is a reference we can use later in our code to refer to the url created.</p><p>Examine the anchor tag above. Notice the value of the href attribute is ${helloLink}. The view page will substitute the hyperlink we created using the url tag for the ${helloLink} reference. Note that the query string parameter will be properly URL-encoded (Bruce+Phillips).</p><div class="confluence-information-macro confluence-information-macro-information"><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>In the next tutorial we'll cover how Struts can access the query string parameter value.</p></div></div><h3 id="UsingStruts2Tags-Struts2FormTags">Struts 2 Form Tags</h3><p>Most applications will use several data entry forms. The Struts 2 tags make creating input forms easy. Consult the <a shape="rect" href="ui-tag-reference.html">Form Tags Reference</a> for all the details about the Struts 2 form tags.</p><p>Each of the Struts 2 form tags has numerous attributes to mimic the normal HTML form tag attributes.</p><p>To create the outer shell of the form, use the Struts 2 form tag. The action attribute sets the action name to submit to.</p><p>Add the following markup to index.jsp after the Hello Bruce Phillips link.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Struts 2 Form</b></div><div class="codeContent panelContent pdl">
<pre class="brush: html; gutter: false; theme: Default" style="font-size:12px;">&lt;p&gt;Get your own personal hello by filling out and submitting this form.&lt;/p&gt;

&lt;s:form action="hello"&gt;

  &lt;s:textfield name="userName" label="Your name" /&gt;
	
   &lt;s:submit value="Submit" /&gt;

&lt;/s:form&gt;


</pre>
</div></div><p>The Struts 2 <a shape="rect" href="textfield.html">textfield</a> tag provides a input html tag of tag text and the submit tag creates a submit button. When the index page is return by the server to the browser you should see:</p><p><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image" src="using-struts-2-tags.data/Struts%20Form.png"></span></p><p>The Struts form, textfield, and submit tags were converted to this HTML.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Struts Form Tags Converted To HTML</b></div><div class="codeContent panelContent pdl">
<pre class="brush: html; gutter: false; theme: Default" style="font-size:12px;">&lt;form id="hello" name="hello" action="/Using_Tags_Struts2_Mvn/hello.action;jsessionid=3471d76027b5342cab44f297b567" method="post"&gt;

&lt;table class="wwFormTable"&gt;

&lt;tr&gt;
    &lt;td class="tdLabel"&gt;&lt;label for="hello_userName" class="label"&gt;Your name:&lt;/label&gt;&lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="userName" value="" id="hello_userName"/&gt;&lt;/td&gt;
&lt;/tr&gt;

&lt;tr&gt;
    &lt;td colspan="2"&gt;&lt;div align="right"&gt;&lt;input type="submit" id="hello_0" value="Submit"/&gt;
&lt;/div&gt;&lt;/td&gt;
&lt;/tr&gt;

&lt;/table&gt;
&lt;/form&gt;


</pre>
</div></div><p>Note how Struts 2 created a table inside the form to position the form elements. In later tutorials you'll learn how to specify the layout (table, CSS). The Struts 2 textfield tag created an HTML input tag of type text with a name value that matches the name value of the textfield tag. Struts 2 also created a label HTML tag based on the label value of the textfield tag.</p><div class="confluence-information-macro confluence-information-macro-information"><span class="aui-icon aui-icon-small aui-iconfont-info confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>In the next tutorial we'll cover how to use Struts 2 to process this form submission.</p></div></div><h3 id="UsingStruts2Tags-Struts2propertytag">Struts 2 property tag</h3><p>In the <a shape="rect" href="hello-world-using-struts-2.html">Hello World</a> tutorial's example application on JSP HelloWorld.jsp was this code:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Struts Property Tag</b></div><div class="codeContent panelContent pdl">
<pre class="brush: html; gutter: false; theme: Default" style="font-size:12px;">&lt;s:property value="messageStore.message" /&gt;

</pre>
</div></div><p>The most common use of the <a shape="rect" href="property.html">property</a> tag is used to "get" the value returned by calling a public get method (of the Action class) and then to include that value in the HTML returned to the browser.</p><p>As discussed in the <a shape="rect" href="hello-world-using-struts-2.html">Hello World</a> tutorial, the value of "messageStore.message" instructs Struts 2 to first call method getMessageStore of the Action class. That method call returns a MessageStore object. The ".message" part instructs Struts 2 to call the getMessage method of the MessageStore object. The getMessage method returns a String which will be included in the HTML returned to the browser.</p><p>One very useful feature of the Struts 2 property tag is that it will automatically convert the most common data types (int, double, boolean) to their String equivalents. To demonstrate this feature let's add a static int variable to class HelloWorldAction.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Add Static Field</b></div><div class="codeContent panelContent pdl">
<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">private static int helloCount = 0;
	
public int getHelloCount() {
	return helloCount;
}

public void setHelloCount(int helloCount) {
	HelloWorldAction.helloCount = helloCount;
}
</pre>
</div></div><p>Each time the execute method is called we'll increase helloCount by 1. So add this code to the execute method of class HelloWorldAction.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Increase helloCount</b></div><div class="codeContent panelContent pdl">
<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">helloCount++;

</pre>
</div></div><p>Whenever a user clicks one of the links on page index.jsp (or submits the form), method execute of class HelloWorldAction will be run and the static field helloCount will be increased by one.</p><p>To include the value of the helloCount attribute in the HelloWorld.jsp we can use the Struts 2 property tag. Add the following to HelloWorld.jsp after the h2 tag.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Use Property Tag To Display helloCount Value</b></div><div class="codeContent panelContent pdl">
<pre class="brush: html; gutter: false; theme: Default" style="font-size:12px;">&lt;p&gt;I've said hello &lt;s:property value="helloCount" /&gt; times!&lt;/p&gt;

</pre>
</div></div><p>So even though the getHelloCount method returns an integer type, Struts 2 converted it to type String and placed it into the body of the p tag.</p><div class="confluence-information-macro confluence-information-macro-tip"><span class="aui-icon aui-icon-small aui-iconfont-approve confluence-information-macro-icon"></span><div class="confluence-information-macro-body"><p>Note that even though helloCount is a static field, the get and set methods for helloCount are not static. For Struts 2 to call the getHelloCount method to get the value of helloCount, the getHelloCount method cannot be static.</p></div></div><p>If the value returned by the get method is an object, then the property tag will cause Struts 2 to call the object's toString method. Of course, you should always override Class Object's toString method in your model classes. Add the following toString method to the MessageStore class:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Add toString Method To Class MessageStore</b></div><div class="codeContent panelContent pdl">
<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">public String toString() {
		
	return message + " (from toString)";
		
}	

</pre>
</div></div><p>Add the following to HelloWorld.jsp</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Using Property Tag to Call toString</b></div><div class="codeContent panelContent pdl">
<pre class="brush: html; gutter: false; theme: Default" style="font-size:12px;">&lt;p&gt;&lt;s:property value="messageStore" /&gt;&lt;/p&gt;

</pre>
</div></div><p>Since getMessageStore of HelloWorldAction class returns a MessageStore object, Struts 2 will call the toString method of class MessageStore. The string returned by that toString method will be displayed in the browser.</p><p><span class="confluence-embedded-file-wrapper"><img class="confluence-embedded-image" src="using-struts-2-tags.data/displaymessagestore.png"></span></p><p>We covered a lot in this tutorial, but we've really only scratched the surface of how to use the Struts 2 tags. Consult the <a shape="rect" href="generic-tag-reference.html">Struts 2 Tag Reference</a> for much more information about all the Struts 2 tags.</p><div class="table-wrap"><table class="confluenceTable"><tbody><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Next</p></th><td colspan="1" rowspan="1" class="confluenceTd"><p>Onward to <a shape="rect" href="coding-struts-2-actions.html">Coding Struts 2 Actions</a></p></td></tr><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Prev</p></th><td colspan="1" rowspan="1" class="confluenceTd"><p>Return to <a shape="rect" href="hello-world-using-struts-2.html">Hello World Using Struts 2</a></p></td></tr></tbody></table></div></div>
        </div>

                    <div class="tabletitle">
                Children
            <span class="smalltext" id="show" style="display: inline;">
              <a href="javascript:showChildren()">Show Children</a></span>
            <span class="smalltext" id="hide" style="display: none;">
              <a href="javascript:hideChildren()">Hide Children</a></span>
            </div>
            <div class="greybox" id="children" style="display: none;">
                                                    $page.link($child)
                    <span class="smalltext">(Apache Struts 2 Documentation)</span>
                    <br>
                            </div>
        
    </div>
</div>
<div class="footer">
    Generated by CXF SiteExporter
</div>
</body>
</html>
